{extend name="common/pop" /}
{block name="content"}

<form class="layui-form" style="margin-top:12px;" id="form">
    <div class="layui-form-item">
        <label class="layui-form-label">账号</label>
        <div class="layui-input-block">
            <input type="text" class="layui-input" name="account" placeholder="请输入账号" required value="{$info.account}">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">昵称</label>
        <div class="layui-input-block">
            <input type="text" class="layui-input" name="nickname" placeholder="请输入昵称" required value="{$info.nickname}">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">密码</label>
        <div class="layui-input-block">
            <input type="password" class="layui-input" name="passwd" placeholder="请输入密码"  >
        </div>
    </div>
    <div class="layui-form-item">
        <label for="" class="layui-form-label">头像</label>
        <div class="layui-input-block j-upload">
            <a href="javascript:;" class="layui-btn layui-btn-primary layui-btn-sm j-upload-dom">
                <input type="file" name="avatar" id="upload_1" class="j-file" onchange="upload(event,this)" accept="image/*">
                <input type="text" class="j-upload-input" readonly="" value="{$info.avatar|get_file_path}" >
                <input type="hidden" name="avatarfile" value="{$info.avatar|intval}">
                <i class="layui-icon layui-icon-upload"></i>选择文件</a>
        </div>
        <div class="j-img-preview">
            <img src="{$info.avatar|get_file_path}" alt="" class="j-img-perview-item">
        </div>

        <div class="layui-input-block j-form-tips">用户头像，双击删除</div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">手机号码</label>
        <div class="layui-input-block">
            <input type="text" class="layui-input" name="mobile" placeholder="请输入手机号码"  value="{$info.mobile}">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">邮箱</label>
        <div class="layui-input-block">
            <input type="text" class="layui-input" name="email" placeholder="请输入邮箱" value="{$info.email}">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">状态</label>
        <div class="layui-input-block">
            <input type="checkbox" name="status" lay-skin="switch" lay-text="正常|禁用" {if $info.status == 1}checked{/if}>
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">语言</label>
        <div class="layui-input-block">
            <select name="mark_lang" lay-verify="">
                <option value="zh">中文</option>
            </select>
        </div>
    </div>

    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn layui-btn-normal" lay-submit lay-filter="create">立即提交</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </div>
</form>
{/block}

{block name="script"}
<script>
    function upload(event,e){
        var file = event.target.files[0]
            , preview = document.querySelector('.j-img-preview')
            , reader = new FileReader();
        if(!file){
            layui.layer.msg('请选择文件');
        }else{
            $(e).next().val($(e).val())

            reader.addEventListener("load", function () {
                if(preview.children.length >= 1){
                    preview.innerHTML = '';
                }
                var image = new Image();
                image.title = file.name;
                image.src = this.result;
                image.classList.add('j-img-preview-item');
                image.ondblclick = function(e){
                    $(e.currentTarget).parent().prev().find('input[type=text]').val('')
                    $(e.currentTarget).remove();

                }

                preview.append( image );
            }, false);

            reader.readAsDataURL(file);
        }
    }

    layui.use(['layer','jquery','form'],function () {
        var form = layui.form,
            layer = layui.layer,
            $ = layui.jquery;

        form.render();

        form.on('submit(create)',function(data){
            var fd = new FormData(document.getElementById("form"));

            $.ajax({
                url:'{:url("update",["id"=>$info["id"]])}',
                type:'post',
                processData: false,//必须
                contentType: false,//必须
                data:fd,
                success:function(r){
                    if(r.code == 1){
                        layer.msg('已提交');
                        close(1500,true);
                    }else{
                        layer.msg(r.msg);
                    }
                },
                error:function(r){
                    layer.msg(r.msg);
                }
            })
           return false;
        });
    })
</script>
{/block}
